<template>
  <!--模态窗 多行-->
  <transition
    name="custom-classes-transition"
    enter-active-class="animated fadeInDown"
    leave-active-class="animated fadeOutUp"
  >
    <div class="modal-ctrl-body" v-if="revampDetailsModal" v-show="revampDetailsModal.isShow">
      <div class="modal-ctrl-main even-row-ctrl" >

        <div class="modal-title">
          <p>修改部门</p>
        </div>
        <div class="modal-ctrl-content">
          <div class="even-row">
            <div class="modal-row" >
              <div class="modal-form-key f-l indispensable">
                部门名称：
              </div>
              <input type="text" maxlength="16" placeholder="最长16个字符" v-model="sectionParams.stationName" class="modal-text f-l">
            </div>

            <div class="modal-row">
              <div class="modal-form-key f-l">
                是否使用：
              </div>
              <select @change="selectIfUse" :value="sectionParams.ifUse">
                <option value="1">是</option>
                <option value="0">否</option>
              </select>
            </div>

            <div class="modal-row" >
              <div class="modal-form-key f-l">
                上级部门：
              </div>
              <input type="text" readonly="readonly" v-model="parentStationName" class="modal-text f-l" >
            </div>

            <div class="modal-row" >
              <div class="modal-form-key f-l">
                部门IP：
              </div>
              <input type="text" class="modal-text f-l" v-model="sectionParams.ipAddress" placeholder="格式必须如：196.168.0.1">
            </div>

            <div class="modal-row" >
              <div class="modal-form-key f-l">
                部门地址：
              </div>
              <input type="text" maxlength="50" placeholder="最长50个字符" v-model="sectionParams.address" class="modal-text f-l">
            </div>

            <div class="modal-row" >
              <div class="modal-form-key f-l">
                联系电话：
              </div>
              <input placeholder="座机（01012345678）或手机" type="text" v-model="sectionParams.tel" class="modal-text f-l">
            </div>

            <div class="modal-row" >
              <div class="modal-form-key f-l indispensable">
                组织代码：
              </div>
              <input type="text" maxlength="15" placeholder="最长15个字符" v-model="sectionParams.orgcode" class="modal-text f-l">
            </div>

            <div class="modal-row" >
              <div class="modal-form-key f-l indispensable">
                部门类型：
              </div>
              <select @change="selectStationNum" v-model="sectionParams.stationNum">
                <option value="-1">请选择部门类型</option>
                <option value="SJ">市局-SJ</option>
                <option value="FJ">分局-FJ</option>
                <option value="ZSJG">直属机构-ZSJG</option>
                <option value="JG">交管-JG</option>
                <option value="PCS">派出所-PCS</option>
                <option value="JCZ">检查站-JCZ</option>
                <option value="JWZ">警务站-JWZ</option>
              </select>
              <!--<input type="text" maxlength="16" placeholder="最长16个字符" v-model="sectionParams.stationNum" class="modal-text f-l">-->
            </div>

            <div class="modal-row" >
              <div class="modal-form-key f-l">
                覆盖范围：
              </div>
              <input type="text" maxlength="250" placeholder="最长250个字符" v-model="sectionParams.coverRange" class="modal-text f-l">
            </div>

            <div class="modal-row" >
              <div class="modal-form-key f-l">
                警车数量：
              </div>
              <input type="text" v-model="sectionParams.carCount" class="modal-text f-l">
            </div>

            <div class="modal-row" >
              <div class="modal-form-key f-l">
                基地台号：
              </div>
              <input type="text" maxlength="16" v-model="sectionParams.baseNum" class="modal-text f-l">
            </div>

            <div class="modal-row" >
              <div class="modal-form-key f-l">
                单位编码：
              </div>
              <input type="text" maxlength="6" v-model="sectionParams.unitNumber" class="modal-text f-l">
            </div>

            <div class="modal-row" >
              <div class="modal-form-key f-l">
                经度：
              </div>
              <input type="text" maxlength="12" v-model="sectionParams.longitude" class="modal-text f-l">
            </div>

            <div class="modal-row" >
              <div class="modal-form-key f-l">
                纬度：
              </div>
              <input type="text" maxlength="11" v-model="sectionParams.latitude" class="modal-text f-l">
            </div>

            <div class="modal-row" >
              <div class="modal-form-key f-l">
                排序：
              </div>
              <input type="text" maxlength="4" placeholder="最长4位字符" v-model="sectionParams.sort" class="modal-text f-l">
            </div>

            <div class="modal-row" >
              <div class="modal-form-key f-l">
                管辖区域：
              </div>
              <input type="text" maxlength="1000" v-model="sectionParams.glxq" class="modal-text f-l">
            </div>

            <div class="modal-row" >
              <div class="modal-form-key f-l">
                人口情况：
              </div>
              <input type="text" maxlength="1000" v-model="sectionParams.rkqk" class="modal-text f-l">
            </div>


            <div class="modal-row" >
              <div class="modal-form-key f-l">
                社区/责任区：
              </div>
              <input type="text" maxlength="1000" v-model="sectionParams.sqzrq" class="modal-text f-l">
            </div>

            <div class="modal-row" >
              <div class="modal-form-key f-l">
                警力情况：
              </div>
              <input type="text" maxlength="1000" v-model="sectionParams.jlqk" class="modal-text f-l">
            </div>

            <div class="modal-row" >
              <div class="modal-form-key f-l">
                重点部位：
              </div>
              <input type="text" maxlength="1000" v-model="sectionParams.zdbw" class="modal-text f-l">
            </div>

            <div class="modal-row" >
              <div class="modal-form-key f-l">
                重点警情：
              </div>
              <input type="text" maxlength="1000" v-model="sectionParams.zdjq" class="modal-text f-l">
            </div>

            <div class="modal-row">
              <div class="modal-form-key f-l">
                是否直属机构：
              </div>
              <select @change="selectisZsjg" :value="sectionParams.isZsjg">
                <option value="1">是</option>
                <option value="0">否</option>
              </select>
            </div>

        <!--    <div class="modal-row">
              <div class="modal-form-key f-l">
                是否口子所：
              </div>
              <select @change="selectisCzs" :value="sectionParams.isCzs">
                <option value="1">是</option>
                <option value="0">否</option>
              </select>
            </div>-->

            <div class="modal-row">
              <div class="modal-form-key f-l">
                是否为业务部门：
              </div>
              <select @change="selectisBusinessDepartment" :value="sectionParams.isBusinessDepartment">
                <option value="0">否</option>
                <option value="1">是</option>
              </select>
            </div>


          </div>

        </div>
        <div class="btns text-r">
          <button type="button" class="btn btn-default" @click="closeModal">取消</button>
          <button
            type="button"
            class="btn btn-info"
            @click="subBtn"
          >确定</button>
        </div>
        <!--{{userDetailsModal.obj}}-->
      </div>
    </div>
  </transition>
</template>

<script>
  export default {
    name: "RevampSection",
    props:["revampDetailsModal","sectionId"],
    data(){
      return{
        //警员信息
        sectionParams:{
          stationName:"", //部门名称
          ifUse:"1", //是否使用
          ipAddress:"", //部门IP
          address:"", //部门地址
          tel:"", //联系电话
          orgcode:"",  //组织代码
          stationNum:"-1", //组织编号
          coverRange:"", //覆盖范围
          carCount:"", //警车数量
          baseNum:"", //基地台号
          unitNumber:"", //单位编码
          longitude:"", //经度
          latitude:"", //纬度
          sort:"", //排序
          glxq:"", //管辖区域
          rkqk:"", //人口情况
          sqzrq:"", //社区/责任区
          jlqk:"", //警力情况
          zdbw:"", //重点部位
          zdjq:"", //重点警情
          isZsjg:"0", //是否直属机构
          isCzs:"0", //是否口子所
          isBusinessDepartment:"0"
        },
        stationName:"",
        parentStationName:"",
        //缓存信息
        getSessionStorage:{},
        policeType:[],
        policePosition:[],
        setting : {
          data: {
            simpleData: {
              enable: true
            },
          }
        },
        sectionTreeIShow:false,
        activeSectionId:""
      }
    },
    created(){
      //日期控件
      $(function () {
        //console.log($("#datetimepicker"));
        $('#date1').datetimepicker({
          language: "zh-CN",
          format: "yyyy-mm-dd",
          minView: "month",
          autoclose: true
        }).on("changeDate",function(ev){
          ////console.log(ev.date.valueOf());
        });
      });
    },
    watch:{
      revampDetailsModal:{
        handler(v1){
          //console.log(v1);
          if( v1.isShow === true ){ //监听弹窗变化。
            ////console.log(v1);
            ////console.log(this.sectionId);
            this.activeSectionId = this.sectionId;
            // let session = JSON.parse(sessionStorage.getItem("stationCommunication"));
            // //console.log(session);
            // this.getSessionStorage.name = session.name;
            // this.getSessionStorage.id = session.id;
            // this.stationName = this.getSessionStorage.name;
            // //console.log(this.getSessionStorage.id);
            // this.sectionParams.parentId = this.getSessionStorage.id;
            // //console.log(this.sectionParams.parentId );
            ////console.log(session);
            //获取查询部门信息
            this.getSectionAjax();
          }
        },
        deep:true
      }
    },
    methods:{
      //提交
      subBtn(){

        if( this.verifyForm.isNull(this.sectionParams.stationName) ){
          this.s_alert("部门名称不能为空！");
          // alert("部门名称不能为空！");
          return false;
        }else if( this.verifyForm.isNull(this.sectionParams.orgcode) || this.verifyForm.letterAndNumber(this.sectionParams.orgcode) ){
          this.s_alert("组织代码为空或格式不正确！只能填写字母和数字！");
          // alert("组织代码不能为空！");
          return false;
        }else if( this.verifyForm.letterAndNumber(this.sectionParams.baseNum) ){
          this.s_alert("基地台号只能为字母和数字！");
          // alert("组织代码不能为空！");
          return false;
        }else if( this.sectionParams.carCount && this.sectionParams.carCount.length > 2 || this.verifyForm.isNumber(this.sectionParams.carCount)  ){
          this.s_alert("警车格式不正确！只能为整数并且最大99辆！");
          return false;
        }else if( this.verifyForm.isNull(this.sectionParams.stationNum) ){
          this.s_alert("请选择部门类型！");
          // alert("组织编号不能为空！");
          return false;
        }else if( this.verifyForm.isTell(this.sectionParams.tel) ){
          this.s_alert("输入联系电话格式错误！8或11位纯数字，如（01012345678或12345678）");
          // alert("输入联系电话格式错误！");
          return false;
        }else if(  this.verifyForm.ifLongitude(this.sectionParams.longitude) ){
          this.s_alert("经度格式不正确或区间范围不在正负180以内，并且小数点后最长只能有8位数！");
          // alert("经度格式不正确或区间范围不在正负180以内，并且小数点后最长只能有18位数！");
          return false;
        }else if( this.verifyForm.isNumber(this.sectionParams.sort) ){
          this.s_alert("排序字段只能为整数！");
          return false;
        }else if( this.verifyForm.ifLatitude(this.sectionParams.latitude) ){
          this.s_alert("纬度格式不正确或区间范围不在正负90以内，并且小数点后最长只能有8位数！");
          // alert("纬度格式不正确或区间范围不在正负90以内，并且小数点后最长只能有18位数！");
          return false;
        }else if( this.verifyForm.letterAndNumber(this.sectionParams.unitNumber) ){
          this.s_alert("单位编码格式不正确！只能为字母或数字！");
          return false;
        }else if( this.verifyForm.isNull(this.sectionParams.ipAddress) ){
          this.sectionParams.ipAddress = null;
        }else if( this.verifyForm.isIP(this.sectionParams.ipAddress) ){
          this.s_alert("ip地址不正确！");
          return false;
        }
        this.s_loading(true);
        this.$axios.get(this.HOST+"/station/getStationInfoByOrgCode",{
          params:{
            orgCode:this.sectionParams.orgcode
          }})
          .then(res=>{
            if( res.data.length === 0 ){
              this.upData();
            }else if( res.data.length > 1 ){
              //this.s_alert("该组织代码已经存在！");
              for( let i=0;i<res.data.length;i++ ){
                if( this.activeSectionId !== res.data[i].id ){
                  this.s_alert("该组织代码已经存在！");
                  break;
                }else{
                  this.upData();
                }
              }
            }else{
              if( this.activeSectionId === res.data[0].id ){
                this.upData();
              }else{
                this.s_alert("该组织代码已经存在！");
                return false;
              }
            }
            this.s_loading(false);
          })
          .catch(err=>{
            console.log(err);
            this.s_loading(false);
          });
      },
      upData(){
        let params = {};
        for( let sectionParamsKey in this.sectionParams ){
          params[sectionParamsKey] = this.sectionParams[sectionParamsKey];
        }
        this.$axios["put"](this.HOST+"/station/"+this.activeSectionId,params)
          .then((data)=>{
            //console.log(data);
            if( data.data.success === true ){
              this.s_alert("修改成功！");
              // alert("修改成功！");
              this.s_logwrite("基础信息管理-部门管理","修改部门");
              this.initAddSectionData();
              this.closeModal();
            }
          })
          .catch((err)=>{
            //console.log(err);
          })
      },
      //是否使用
      selectIfUse(ele){
        this.sectionParams.ifUse = ele.target.value;
        ////console.log(ele.target.value);
      },
      //部门类型
      selectStationNum(ele){
        this.sectionParams.stationNum = ele.target.value;
        ////console.log(ele.target.value);
      },
      //是否直属机构
      selectisZsjg(ele){
        this.sectionParams.isZsjg = ele.target.value;
        ////console.log(ele.target.value);
      },
      //是否口子所
      selectisCzs(ele){
        this.sectionParams.isCzs = ele.target.value;
        ////console.log(ele.target.value);
      },
      //是否业务部门
      selectisBusinessDepartment(ele){
        this.sectionParams.isBusinessDepartment = ele.target.value;
        console.log(ele.target.value);
      },
      //查询部门数据
      getSectionAjax(){
        //console.log(this.activeSectionId);
        this.$axios.get(this.HOST+"/station/"+this.activeSectionId)
          .then((data)=>{
            //console.log(data);
            let successData = data.data;
            this.parentStationName = successData.parentId;
            //console.log(this.parentStationName);
            //console.log(successData);
            for( let sectionParamsKey in this.sectionParams ){
              for( let successDataKey in successData ){
                if( sectionParamsKey === successDataKey ){
                  this.sectionParams[successDataKey] = successData[sectionParamsKey];
                }
              }
            }
            //console.log(this.sectionParams);
          })
          .catch((err)=>{
            //console.log(err);
          })
      },
      //获取部门树
      getStationTree(){
        this.sectionTreeIShow = true;
        this.$axios.get(this.HOST+'/station/getOrgaInfo',this.getSessionStorage.id)
          .then((data)=>{
            $.fn.zTree.init($("#sectionTree"), this.setting, data.data.data);
            //console.log(data);
          })
          .catch((err)=>{
            //console.log(err);
          })
      },
      //关闭模态窗
      closeModal(){
        this.$emit("closeModalRevampSection");
      },
      //清除新增部门
      initAddSectionData(){
        this.sectionParams={
          stationName:"", //部门名称
          ifUse:"1", //是否使用
          ipAddress:"", //部门IP
          address:"", //部门地址
          tel:"", //联系电话
          orgcode:"",  //组织代码
          stationNum:"-1", //组织编号
          coverRange:"", //覆盖范围
          carCount:"", //警车数量
          baseNum:"", //基地台号
          unitNumber:"", //单位编码
          longitude:"", //经度
          latitude:"", //纬度
          sort:"", //排序
          glxq:"", //管辖区域
          rkqk:"", //人口情况
          sqzrq:"", //社区/责任区
          jlqk:"", //警力情况
          zdbw:"", //重点部位
          zdjq:"", //重点警情
          isZsjg:"0", //是否直属机构
          isCzs:"0", //是否口子所
          isBusinessDepartment:"0"
        }
      }
    }
  }
</script>

<style scoped>
  .sectionTree-box{
    position: absolute;
    z-index: 99;
    padding: 10px;
    right: 0;
    width: 60%;
    top: 30px;
    height: 200px;
    overflow-y: auto;
    background: #fff;
    border: 1px solid rgba(51,51,51,0.2);
  }
  .form-control{
    height: 100%;
    border: 1px solid #ccc;
  }
</style>
